package com.ohuang.test_compose.page

import androidx.compose.foundation.layout.Column
import androidx.compose.foundation.layout.Spacer
import androidx.compose.foundation.layout.padding
import androidx.compose.foundation.layout.size
import androidx.compose.material3.Text
import androidx.compose.runtime.Composable
import androidx.compose.ui.ExperimentalComposeUiApi
import androidx.compose.ui.Modifier
import androidx.compose.ui.graphics.Color
import androidx.compose.ui.graphics.drawscope.ContentDrawScope
import androidx.compose.ui.node.DrawModifierNode
import androidx.compose.ui.node.ModifierNodeElement
import androidx.compose.ui.unit.dp

@Composable
fun CustomModifierPage() {
    Column {
        Spacer(
            modifier = Modifier
                .circle(Color.Red)
                .size(50.dp)
        )

        Text(
            text = "aaaaaaaaaaaaa", modifier = Modifier
                .circle(Color(0xffff0000))
                .padding(5.dp)
                .circle(Color(0x8000ffff))
        )

        Column(
            modifier = Modifier
                .circle(Color(0xffff0000))
                .padding(20.dp)
                .circle(Color(0x8000ffff))
        ) {
            Text(text = "bbbbbbbb")
        }
    }
}


@OptIn(ExperimentalComposeUiApi::class)
private class CircleNode(var color: Color) : DrawModifierNode, Modifier.Node() {
    override fun ContentDrawScope.draw() {
        drawCircle(color)
        drawContent()
    }


}

@OptIn(ExperimentalComposeUiApi::class)
private data class CircleElement(val color: Color) : ModifierNodeElement<CircleNode>() {
    override fun create() = CircleNode(color)

    override fun update(node: CircleNode): CircleNode {
        node.color = color
        return node
    }

}

fun Modifier.circle(color: Color) = this then CircleElement(color)